<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>忘记密码</title>
    <!--layui样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/style.css"/>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js"></script>
    <!--JQ-->
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/jquery-1.8.3.min.js"></script>
</head>
<body>
<!--头部-->
<header class="whitebg">
    <div><img src="${re.contextPath}/plugin/common/images/2@2x.png" class="logo" alt=""/></div>
</header>
<!--容器-->
<div class="container">
    <!--占位-->
    <div class="headerHight"></div>
    <div class="bgImg">
        <div class="login clearfix">
            <div class="loginLeft fl bluebg center">
                <img src="${re.contextPath}/plugin/common/images/1@2x.png" alt="">
                <div class="white ft20 mt50">欢迎使用信息技术咨询和<br/>管理科技服务云平台</div>
            </div>
            <div class="loginRight fr whitebg">
                <ul class="ft26 bold clearfix">
                    <li class="fl focus">忘记密码</li>
                </ul>
                <div class="tabBox">
                    <!--登录-->
                    <div class="loginMain">
                        <form action="${re.contextPath}/sys/register/resetPassWord" method="post" class="layui-form">
                            <span class="gary">邮箱</span>
                            <nav>
                                <input type="text" name="email" id="email" lay-verify="email" value="${email}"  placeholder="请输入邮箱"/>
                                <input type="button" class="cursor" value="获取验证码" onclick="sendCode(this)"/>
                            </nav>
                            <span class="gary">验证码：</span>
                            <div>
                                <input type="text" name="code" id="" value="" lay-verify="code" placeholder="请输入验证码"/>
                            </div>
                            <div class="codePassword gary clearfix">
                                <span class="fr"><a href="${re.contextPath}/login" class="gary">去登录</a></span>
                            </div>
                            <div>
                                <button type="submit" lay-submit lay-filter="reset" class="bluebg white">重置密码</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--JS-->
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/tools/tool.js"></script>

<script>
    //获取验证码
    var clock = '';
    var nums = 60;
    var btn;
    layui.use(['form', 'layer'], function(){
        var layer = layui.layer,form = layui.form;
        form.verify({
            email: function (v) {
                if (v.trim() == '') {
                    return "邮箱不能为空";
                }
                if (v.trim() != '') {
                    var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
                    var flag = reg.test(v.trim());
                    if (!flag) {
                        return '邮箱格式输入有误';
                    }
                }
            },
            code: function (v) {
                if (v.trim() == '') {
                    return "验证码不能为空";
                }
            }
        });

        var msg = '${msg}';
        if (msg.trim() != "") {
            layer.msg(msg, {icon: 5, anim: 6, offset: 't'});
        }

        form.render();

    });
    function sendCode(thisBtn) {
        var email = $("#email").val();
        if(!email){
            layer.msg("邮箱不能为空", {icon: 5, anim: 6, offset: 't'});
            return ;
        }
        if($("#email").val()){
            var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
            var flag = reg.test(email.trim());
            if (!flag) {
                layer.msg("邮箱格式输入有误", {icon: 5, anim: 6, offset: 't'});
                return ;
            }

            layerAjax('/sys/register/sendEmail', {email: $("#email").val()}, '', function (d) {
                if(d.flag){
                    layer.msg(d.msg, {icon:1, anim: 6});
                    btn = thisBtn;
                    btn.disabled = true; //将按钮置为不可点击
                    btn.value = nums + '秒后重新获取';
                    clock = setInterval(doLoop, 1000); //一秒执行一次
                }else{
                    layer.msg(d.msg, {icon: 5, anim: 6, offset: 't'});
                }
            });
        }else{
            layer.msg("请输入邮箱", {icon: 5, anim: 6, offset: 't'});
        }

        /*$('body')._postd({email:$("#email").val()},function(data){
                console.log(data);
        },"/login/sendEmail");*/

    }
    function doLoop() {
        nums--;
        if (nums > 0) {
            btn.value = nums + '秒后重新获取';
        } else {
            clearInterval(clock); //清除js定时器
            btn.disabled = false;
            btn.value = '获取验证码';
            nums = 60; //重置时间
        }
    }
</script>
</body>
</html>
